import React from 'react'
import Tit from '../../components/Tit'
import OrderShop from '../../components/OrderShop'
import { InputItem, TextareaItem } from 'antd-mobile'
import { withRouter } from 'react-router-dom'
import './AfterSale.less'
class AfterSale extends React.Component {
    state = {
        name: '',
        phone: '',
        reason: '',
        OrderDetail: ''
    }
    handleChange(event, key) {
        this.setState({ [event]: key })
    }
    GO = () => {
        console.log()
        var a = { name: this.state.name, phone: this.state.phone, reason: this.state.reason }
        this.props.match.params.url == 1 ? this.$postData('/api/order/refundMoney', { orderId: this.props.match.params.id, ...a }, params => {
            console.log(params)
            switch (params.code) {
                case 100:
                    this.Toast.info(params.msg);
                    this.props.history.goBack()
                    break;
                default:
                    this.Toast.info(params.msg);
                    break;
            }
        }) :
            this.$postData('/api/order/returnGood', { id: this.props.match.params.id, ...a }, params => {
                console.log(params)
                switch (params.code) {
                    case 100:
                        this.Toast.info(params.msg);
                        this.props.history.goBack()
                        break;
                    default:
                        this.Toast.info(params.msg);
                        break;
                }
            })
    }
    componentDidMount() {
        console.log(this.props.match.params.url)
        this.props.match.params.url == 1 ? this.$postData('/api/order/getOrderMsg', { orderId: this.props.match.params.id }, params => {
            console.log(params)
            switch (params.code) {
                case 100:
                    this.setState({
                        OrderDetail: params.data
                    })
                    break;
                default:
                    this.Toast.info(params.msg);
                    break;
            }
        }) :
            this.$postData('/api/order/getGoodsMsg', { id: this.props.match.params.id }, params => {
                console.log(params)
                switch (params.code) {
                    case 100:
                        this.setState({
                            OrderDetail: [params.data]
                        })
                        break;
                    default:
                        this.Toast.info(params.msg);
                        break;
                }
            })
    }
    render() {
        return (
            <div>{this.state.OrderDetail ? <div>
                <Tit zz={true} tit={this.props.match.params.url == 1 ? '申请退款' : '申请退货'}></Tit>
                {this.props.match.params.url == 1 ? this.state.OrderDetail.voList.map((val, index) => (
                    <OrderShop key={index} data={val} ID={1} status={this.state.OrderDetail.status}></OrderShop>
                )) : this.state.OrderDetail.map((val, index) => (
                    <OrderShop key={index} data={val} ID={1} status={this.state.OrderDetail.status}></OrderShop>
                ))}

                <div className='AfterS-d1' onClick={() => console.log(this.state)}><p>{this.props.match.params.url == 1 ? '申请退款' : '申请退货'}金额:</p><p>¥88.00</p></div>
                <div className='AfterS-d2'>
                    <InputItem
                        placeholder="请输入您的姓名"
                        maxLength='30'
                        onChange={this.handleChange.bind(this, 'name')}
                    >姓名</InputItem>
                </div>
                <div className='AfterS-d2'>
                    <InputItem
                        type="number"
                        placeholder="请输入您的手机号"
                        maxLength='11'
                        onChange={this.handleChange.bind(this, 'phone')}
                    >姓名</InputItem>
                </div>
                <div className='AfterS-d3'>
                    <TextareaItem
                        rows={3}
                        placeholder={`请输入您的退${this.props.match.params.url == 1 ? '款' : '货'}原因`}
                        maxLength='50'
                        onChange={this.handleChange.bind(this, 'reason')}
                    />
                </div>
                <div className='AfterS-d4 center' onClick={this.GO}>提交</div>
            </div> : <div></div>}</div>
        )
    }
}

export default withRouter(AfterSale)